<!DOCTYPE html>
<!-- 声明文档类型-->
<html lang="en">
<!-- 确定语言形态 -->
<head>
    <meta charset="UTF-8">
    <!--控制网页的编码格式 utf-8 国际性编码-->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--控制视口比例以及缩放-->
    <title>首页</title>
    <!-- 先引入重置样式表和公共样式表以及主页样式表 -->
    <link rel="stylesheet" href="/resources/reset.css">
    <link rel="stylesheet" href="/resources/public.css">
    <link rel="stylesheet" href="/resources/detail.css">
    <!-- 这个顺序引入更规范 -->

</head>

<body>


<!-- 市场项目那一部分 -->
<div class="case_con">
    <div class="bookDiv bookDetails">
        <div class="bookTitle bookDetailsTitle">书籍信息</div>

        <div class="bookDetailsInfor bookName">
            <div class="bookDetailItem">书名 ：</div>
            <div class="bookDetailItemInfor">《网络与分布》</div>
        </div>
        <div class="bookDetailsInfor bookAuthor">
            <div class="bookDetailItem">作者 ：</div>
            <div class="bookDetailItemInfor">王小溪</div>
        </div>
        <div class="bookDetailsInfor bookPublisherTime">
            <div class="bookDetailItem">出版时间：</div>
            <div class="bookDetailItemInfor">2020-11</div>
        </div>
        <div class="bookDetailsInfor bookDescription">
            <div class="bookDetailItem">描述 ：</div>
            <div class="bookDetailItemInfor">测试书2</div>
        </div>
        <div class="bookDetailsInfor bookCollection">
            <div class="bookDetailItem">馆藏 ：</div>
            <div class="bookDetailItemInfor">1</div>
        </div>
        <div class="bookDetailsInfor bookInPavilion">
            <div class="bookDetailItem">在馆 ：</div>
            <div class="bookDetailItemInfor">2</div>
        </div>
        <div>
            <button class="bookFunction bookFunction1">修改信息</button>
            <button class="bookFunction bookFunction2">增加副本</button>
        </div>
    </div>
    <div class="bookDiv bookList">
        <div class="bookTitle bookListTitle">书籍列表</div>
        <table border="1">
            <!--header-->
            <tr>
                <th class="bookHeader">编号</th>
                <th class="bookHeader">位置</th>
                <th class="bookHeader">状态</th>
                <th class="bookHeader"></th>
                <th class="bookHeader"></th>
                <th class="bookHeader"></th>
            </tr>
            <!--item-->
            <tr>
                <td class="bookNumber">isbn2222-1</td>
                <td class="bookLocation">1F-A-2-2</td>
                <td class="bookState">在库</td>
                <td class="bookOperation"><a href="#">借阅详情</a></td>
                <td class="bookOperation"><a href="#">修改信息</a></td>
                <td class="bookOperation"><a href="#">删除</a></td>
            </tr>

        </table>
    </div>
</div>
<!-- 产品中心那一部分的平铺-->
<div id="links">
    <!-- 这个顺序引入更规范 -->
    <div class="links_con">
        <!-- 版心部分 -->
        <!-- 左边的盒子 -->
        <div class="links_l">
            <h3 class="links_title">课程名</h3>
            <ul class="links_list">
                <li>
                    <a href="#">企业级应用程序设计</a>
                </li>
            </ul>
        </div>
        <!-- 中间的盒子 -->
        <div class="links_c">
            <h3 class="links_title">项目</h3>
            <ul class="links_list">
                <li>
                    <a href="#">图书馆管理系统</a>
                </li>
            </ul>
        </div>
    </div>
</div>
</body>

</html>